<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
  <title>登录页面</title>
  <base href="http://localhost:8080/Barbr/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <link href="css/login.css" rel="stylesheet" type="text/css" media="all" />
  <script src="js/login.js"></script>
  <script src="http://static.runoob.com/assets/vue/1.0.11/vue.min.js"></script>
  <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
</head>
<body>
<!-- main -->
<div class="main-w3layouts wrapper">
  <div class="main-agileinfo">
    <div class="agileits-top">
      <h2>时尚理发馆</h2>
      <form action="login?action=logIn" method="post" id="login">
        <c:if test="${cookie.get('username') == null || cookie.get('username') == ''}">
          <input class="text" type="text" id="username" name="username"
                 placeholder="用户名" v-model="username"  maxlength="20">
        </c:if>
        <c:if test="${cookie.username != null && cookie.username != ''}">
          <input class="text" type="text" value="${cookie.username.value}" id="username" name="username"
                 placeholder="用户名" v-model="username"  maxlength="20">
        </c:if>
        <input class="text" type="password" name="password" id="password" placeholder="密码" v-model="password"  maxlength="20">
        <div class="wthree-text">
          <ul>
            <li>
              <label class="anim">
                <input type="checkbox" class="checkbox" id="rememberMe" onclick="setRememberMe()" checked name="rememberMe">
                <span> 记住 ?</span>
              </label>
            </li>
            <li><a href="javascript:void(0)" onclick="javascript:window.open('html/reset.html')">忘记密码 ?</a> </li>
          </ul>
          <div class="clear"></div>
        </div>
        <input type="submit" value="登录">
        <input type="button" value="注册" onclick="javascript:window.open('html/regist.html')"/>
      </form>
    </div>
  </div>
  <!-- copyright -->
  <div class="w3copyright-agile">
    <p>© 2021 HYIT</p>
  </div>
  <ul class="w3lsg-bubbles">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>

</body>
</html>
<script>
  const index = new Vue({
    el: "#login",
    data:{
      username: null,
      password: null,
      returnUrl:""
    },
  // created(){
  //   const returnUrl =app.getUrlParam("returnUrl");
  // if(returnUrl != null&&returnUrl != undefined && returnUrl != ''){
  // this.returnUrl=returnUrl;
  // }
  // },
    methods: {},
    getRequest(){
    },
    postRequest(){
    },
    doLogin() {
        if (this.username == null || this.username == undefined || this.username == '') {
          alert("用户名不能为空");
          return;
        } else if (this.password == null || this.password == undefined || this.password == '') {
          alert("密码不能为空");
          return;
        }
        const userBO = {
          username: this.username,
          password: this.password
        };
        const serverUrl = app.serverUrl;
        alert(serverUrl)
        const returnUrl = this.returnUrl;
    // form提交
        axios.defaults.withCredentials = true;  //允许跨域携带cookie信息
        axios.post(serverUrl + '<<url>>', userBO).then(res => {
          if (res.data.stat != 200) {
            return;
          }
          const user = res.data;
          if (returnUrl != null && returnUrl != undefined && returnUrl != '') {
            window.location.href = returnUrl;
          } else {
            window.location.href = "管理会员页面";
          }
          if (res.data.status == 500) {
            alert(res.data.msg);
            return;
          }
      })}})
</script>